<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>后台管理 - 易买网</title>
    <link type="text/css" rel="stylesheet" href="../css/style.css"/>
    <script type="text/javascript" src="../scripts/function-manage.js"></script>
  </head>
  <body>
    <div id="header" class="wrap">
      <div id="logo"><img src="../images/logo.gif"/></div>
      <div class="help"><a href="../index.html">返回前台页面</a></div>
      <div class="navbar">
        <ul class="clearfix">
          <li><a href="index.html">首页</a></li>
          <li><a href="user.html">用户</a></li>
          <li class="current"><a href="product.html">商品</a></li>
          <li><a href="order.html">订单</a></li>
          <li><a href="guestbook.html">留言</a></li>
          <li><a href="news.html">新闻</a></li>
        </ul>
      </div>
    </div>
    <div id="childNav">
      <div class="welcome wrap">
        管理员pillys您好，今天是2012-12-21，欢迎回到管理后台。
      </div>
    </div>
    <div id="position" class="wrap">
      您现在的位置：<a href="index.html">易买网</a> &gt; 管理后台
    </div>
    <div id="main" class="wrap">
      <div id="menu-mng" class="lefter">
        <div class="box">
          <dl>
            <dt>用户管理</dt>
            <dd><em><a href="user-add.html">新增</a></em><a href="user.html">用户管理</a></dd>
            <dt>商品信息</dt>
            <dd><em><a href="productClass-add.html">新增</a></em><a href="productClass.html">分类管理</a>
            </dd>
            <dd><em><a href="product-add.html">新增</a></em><a href="product.html">商品管理</a></dd>
            <dt>订单管理</dt>
            <dd><a href="order.html">订单管理</a></dd>
            <dt>留言管理</dt>
            <dd><a href="guestbook.html">留言管理</a></dd>
            <dt>新闻管理</dt>
            <dd><em><a href="news-add.html">新增</a></em><a href="news.html">新闻管理</a></dd>
          </dl>
        </div>
      </div>
      <div class="main">
        <h2>商品管理</h2>
        <div class="manage">
          <table class="list">
            <thead>
              <tr>
                <th>ID</th>
                <th>商品名称</th>
                <th>操作</th>
              </tr>
            </thead>
            <tbody id="products">
              <tr>
                <td class="first w4 c">1</td>
                <td class="thumb"><img src="../images/product/0_tiny.gif"/><a
                    href="../product-view.html" target="_blank">铁三角 Audio-Technica ATH-EQ300M-SV 银色
                  挂耳式耳机</a></td>
                <td class="w1 c"><a href="product-modify.html">修改</a> <a
                    href="javascript:Delete(1);">删除</a>
                </td>
              </tr>
              <tr>
                <td class="first w4 c">1</td>
                <td class="thumb"><img src="../images/product/0_tiny.gif"/>
                  <a href="../product-view.html" target="_blank">铁三角 Audio-Technica ATH-EQ300M-SV 银色
                    挂耳式耳机</a></td>
                <td class="w1 c">
                  <a href="product-modify.html">修改</a>
                  <a href="javascript:void(0)" id="productDel">删除</a>
                </td>
              </tr>
            </tbody>
            <tfoot>
              <tr>
                <td colspan="3">
                  <div class="pager">
                    <ul class="clearfix" id="page">
                      <li><a href="#">上一页</a></li>
                      <li class="current">1</li>
                      <li><a href="#">2</a></li>
                      <li><a href="#">3</a></li>
                      <li><a href="#">4</a></li>
                      <li><a href="#">5</a></li>
                      <li><a href="#">下一页</a></li>
                    </ul>
                  </div>
                </td>
              </tr>
            </tfoot>
          </table>
        </div>
      </div>
      <div class="clear"></div>
    </div>
    <div id="footer">
      Copyright &copy; 2010 北大青鸟 All Rights Reserved. 京ICP证1000001号
    </div>
  </body>
  <script src="../js/jquery-3.3.1.min.js"></script>
  <script>
    function showProducts(currentPage) {
      $.ajax({
        url: '../productAdminShowServlet',
        data: {currentPage: currentPage},
        dataType: 'json',
        type: 'post',
        success: function (data) {
          console.log(data);

          //商品信息展示
          let produces = data.list;
          let str = '';
          for (let i = 0; i < produces.length; i++) {
            let product = produces[i];
            str += '<tr>\n'
                + ' <td class="first w4 c">' + product.epId + '</td>\n'
                + ' <td class="thumb"><img src="../' + product.epFileName + '"/>\n'
                + '<a href="../product-view.html" target="_blank">' + product.epName + '</a>'
                + '   </td>\n'
                + '<td class="w1 c">'
                + '   <a href="product-modify.html?epId=' + product.epId + '">修改</a> '
                + '   <a href="javascript:void(0)" name="productDel">删除</a>\n'
                + '  </td>\n'
                + '</tr>'
          }
          $('#products').html(str);

          // 页码
          // 页码信息

          //总页数
          let totalPage = data.totalPage;
          var currentPage = data.currentPage;
          let cur_str = '';
          if (currentPage > 1) {
            cur_str += '<li><a href="javascript:void(0)" onclick="showProducts(' + currentPage
                + ' - 1)">上一页</a></li>';
          }
          let start;
          let end;
          if (totalPage <= 5 || currentPage <= 3) {
            start = 1;
            end = totalPage;
          } else if (currentPage > 3 && currentPage < totalPage - 2) {
            start = currentPage - 2;
            end = currentPage + 2;
          } else {
            start = totalPage - 4;
            end = totalPage;
          }

          for (let i = start; i <= end; i++) {
            if (i == currentPage) {
              cur_str += '<li class="current">' + i + '</li>';
              continue;
            }
            cur_str += '<li onclick="showProducts(' + i + ')">' + i + '</li>';
          }

          if (currentPage < totalPage) {
            cur_str += '<li><a href="javascript:void(0)" onclick="showProducts(' + currentPage
                + ' + 1)">下一页</a></li>';
          }
          $('#page').html(cur_str);

          $('a[name="productDel"]').on('click', function () {
            if (confirm("确定要删除吗？")) {
              $.ajax({
                url: '../productAdminDelServlet',
                type: 'post',
                dataType: 'json',
                data: {epId: $(this).parent().parent().children('td:first').text()},
                success: function (data) {
                  if (data) {
                    showProducts(currentPage);
                  }
                }
              });
            }
          });
          window.scrollTo(0, 0);
        }
      });
    }

    $(function () {
      showProducts();

    });
  </script>
</html>
